<template>
  <div>
    <section>
      <img class="full-width" src="/static/bg11.png" alt="">
    </section>
    <section class="section-2 relative">
      <p class="header mt60">CITY OBSERVATION PROJECT<span>市观摩工程</span></p>
      <div class="rules-item">
        <div class="mod flex-space-between" v-for="(item, index) in list" :key="index" @click="toDetail(item)">
          <div class="mod-left">
            <span class="circel"></span>
            <span class="title">{{item.title}}</span>
          </div>
          <div class="mod-right">
            <a  @click.stop="down(item.realPath)" class="down">下载</a>
            <span class="time">{{item.time}}</span>
          </div>
        </div>
      </div>
      <a-pagination class="xh-pager" :pageSize="pageSize" @change="changePage" v-model="current" :total="total" show-less-items />
    </section>
  </div>
</template>
<script>
export default {
  name: 'association',
  data () {
    return {
      list: [],
      current: 1,
      total: 0,
      pageSize: 10
    }
  },
  components: {
  },
  computed: {
  },
  created () {
    this.getArticles()
  },
  methods: {
    getArticles () {
      this.$http.getArticles({}, 'SGBGC', this.current, this.pageSize).then(res => {
        res.data.list.forEach(v => {
          v.realPath = `${process.env.VUE_APP_SRC}${v.realPath}`
        })
        this.total = res.data.total
        this.list = res.data.list
      })
    },
    changePage (page, size) {
      this.current = page
      this.getArticles()
    },
    toDetail (item) {
      this.$router.push({ path: `/fold/${item.id}` })
    },
    down (url) {
      if (url) {
        window.location.href = url
      }
    }
  }
}
</script>
<style lang="scss">
</style>
